﻿
<div class=" rounded shadow-sm bg-opacity">
    <MResponsive AspectRatio="16/9D">
        <MDCard Style=" display: contents; " OnClick="ClickImage">
            <div style="@($"background-image: url({Model.FileName}); border-radius: 0;")" class="image-contain">

            </div>
        </MDCard>
    </MResponsive>
    <span style=" color: gray; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;" class="p-2 pt-3">
        <i class="fa fa-calendar fa-fw"></i>
        <span class="article-home-infor-text">@Model.UploadTime.ToString("yyyy-MM-dd HH:mm")&nbsp;&nbsp;&nbsp;</span>

        <i class="fa fa-database fa-fw"></i>
        <span class="article-home-infor-text">@(((double)Model.FileSize/(1024*1024)).ToString("0.00")) MB&nbsp;&nbsp;&nbsp;</span>

        <a href="@("/space/index/" + Model.UserId)" style="color:gray;">
            <i class="fa fa-user fa-fw" ></i>
            <span class="article-home-infor-text">@Model.UserName</span>

        </a>
    </span>
</div>


@code {
    [Parameter]
    public ImageInforTipViewModel Model { get; set; }
    [Parameter]
    public EventCallback<ImageInforTipViewModel> OnClickImage { get; set; }

    public async Task ClickImage()
    {

        await OnClickImage.InvokeAsync(Model);
    }
}
